<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <script src="../../js/mui.min.js"></script>
    <link href="../../css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css" href="../../css/AddDevice_4.css"/>
    
</head>
<body>
	<header class="mui-bar mui-bar-nav">
		
		<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		<div>
			
			<h1 class="mui-title">新增设备</h1>
		</div>
	</header>
	<div class="flowChart">
		<div class="flowChartImg">
			<div class="selectIMGY">
				<h4>1</h4>
			</div>
			<div class="flowChartLine_1"></div>
			<div class="selectIMGY">
				<h4>2</h4>
			</div>
			<div class="flowChartLine_1"></div>
			<div class="selectIMGY">
				<h4>3</h4>
			</div>
			<div class="flowChartLine_1"></div>
			<div class="selectIMGY">
				<h4>4</h4>
			</div>
			<div class="flowChartLine_2"></div>
			<div class="selectIMGX">
				<h4>5</h4>
			</div>
			
		</div>
		<div class="flowChartText">
			<div>
				<h5 class="flowChartText_3">归属信息</h5>
			</div>
			<div>
				<h5 class="flowChartText_3">基本信息</h5>
			</div>
			<div>
				<h5 class="flowChartText_3">个性信息</h5>
			</div>
			<div>
				<h5 class="flowChartText_2">信息确认</h5>
			</div>
			<div>
				<h5 class="flowChartText_1">新增成功</h5>
			</div>
		</div>
	</div>
	<div class="confirmMainTop confirmMainTop1">
		<div class="confirmTopItem">
			<div class="confirmTopTitle">
				<h5>归属信息</h5>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>医院</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="hospital"></h4>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>科室</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="dep"></h4>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>负责人</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="people"></h4>
			</div>
		</div>
	</div>
	<div class="confirmMainTop confirmMainTop2">
		<div class="confirmTopItem">
			<div class="confirmTopTitle">
				<h5>基本信息</h5>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>设备类型一</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="DeviceType"></h4>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>设备类型二</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="DeviceTypeTwo"></h4>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>设备类型三</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="DeviceTypeThree"></h4>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>设备型号</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="DeviceModel"></h4>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>设备名称</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="DeviceName"></h4>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>设备厂家</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="DeviceFactory"></h4>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>设备场地</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="DeviceArea"></h4>
			</div>
		</div>
		<div class="confirmTopItem4">
			<div class="confirmTopItemLeft2">
				<h5>基本图片</h5>
			</div>
			<div id="largeMainAreaFather1" class="largeMainAreaFather" >
				<div id="BasicImg" class="confirmTopItemRight2">
					
				</div>
			</div>			
		</div>
		<div class="confirmTopItem3">
			<div class="confirmTopItemLeft">
				<h5>设备信息描述</h5>
			</div>
			<div class="confirmTopItemRight" id="baseDeviceDescription">
				<p></p>
			</div>
		</div>
	</div>
	<div class="confirmMainTop confirmMainTop3">
		<div class="confirmTopItem">
			<div class="confirmTopTitle">
				<h5>个性化信息</h5>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>资产编号</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="AssetNumberDom"></h4>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>出厂日期</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="ProductionDate"></h4>
			</div>
		</div>
		<div class="confirmTopItem">
			<div class="confirmTopItemLeft">
				<h5>设备状态</h5>
			</div>
			<div class="confirmTopItemRight">
				<h4 id="DeviceState"></h4>
			</div>
		</div>
		<div class="confirmTopItem3">
			<div class="confirmTopItemLeft">
				<h5>设备描述</h5>
			</div>
			<div class="confirmTopItemRight" id="DeviceDescription">
				<p></p>
			</div>
		</div>
		<div class="confirmTopItem4">
			<div class="confirmTopItemLeft2">
				<h5>个性化图片</h5>
			</div>
			<div id="largeMainAreaFather" class="largeMainAreaFather" >
				<div id="CustomImg" class="confirmTopItemRight2">
					
				</div>
			</div>
			
		</div>
	</div>
	<button type="button" class="mui-btn mui-btn-royal mui-btn-block" onclick="onPress()">下一步</button>
	<script src="../../js/mui.zoom.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../js/mui.previewimage.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript" charset="UTF-8">
      	mui.init();
      	mui.previewImage();
      	//声明四个变量用来保存图片相关数据
      	var basicPicIsUrl=false,basicPic,customPic,basicUrl;
      	//mui.previewImage();
      	//页面跳转按钮事件
      	var onPress=function(){
      		//在此将所有数据提交给服务器
      		postData();
      	}
      	
      	//声明一个方法，用于提交数据
      	var postData=function(){
      		mui.ajax("http://app.xiaoweicanting.com/hospital.php?m=App&c=equipment&a=addEquipment",{
      			data:{
      				//归属信息
      				hospitalid:self.HospitalId,
      				hospitalname:self.Hospital,
      				departmentid:self.DepId,
      				departmentname:self.Dep,
      				inchargeuid:self.PeopleId,
      				inchargeuname:self.People,
      				
      				//基本信息
      				devicetype:self.DeviceType,
      				devicetypeid:self.DeviceTypeId,
      				devicetype2:self.deviceTypeTwo,
      				devicetype2id:self.deviceTypeTwoId,
      				devicetype3:self.deviceTypeThree,
      				devicetype3id:self.deviceTypeThreeId,
      				
      				modelid:self.modelId,
      				modelname:self.DeviceModel,
      				
      				name:self.DeviceName,
      				devicefactoryinfo:self.deviceFactoryInfo,
      				devicefactoryid:self.deviceFactoryId,
      				devicearea:self.DeviceArea,
      				//基本图片
      				basicimg:self.basicImgURL,
      				modelinf:self.DeviceInf,
      				 
      				 //个性化信息
      				assetscode:self.AssetNumber,
      				productdate:self.productionDate.substring(0,10),
					devicestate:self.equipmentState,
					intro:self.DeviceDescription,
					customimg:flatImg(self.customImg),
      				adduid:"4",
      				adduname:"lee",
      			},
      			dataType:'json',
      			type:'post',
      			timeout:10000,
      			success:function(data){ 
      				if(data.state == "success"){
      					mui.openWindow({
					    url:'AddDevice_5.html',
					    id:'AddDevice_5.html',
						});
      				}else{
      					mui.toast(data.msg);
      				}      				
      			},
      			error:function(xhr,type,errorThrown){
      				mui.toast('网络故障，请稍后再试');
      			}
      		});
      	}
      	
      	//声明一个方法，用于判断照片是本地的还是服务器上还是没有
      	var judgeImg=function(type,src){
      		
      		if(type){//在type为1的状态下，表示传入的是基础信息图片
      			if((src[0]=="")||(src[0].substring(0,4)=="http")){//如果传入的空值或者是本地文件，则直接上传即可
      				
      				//若src为空或为服务端上的url，basicPicSign为true
      				basicPicIsUrl=true;
      				basicUrl=src;
      				
      			}
      			else{//否则，对照片进行压缩，并返回
      				for (var i=0;i<src.length;i++) {
      					
      					basicPic.push(imgZip(src[i]));
      				}
      				
      			}
      			
      			
      		}
      		else{
      			for (var i=0;i<src.length;i++) {
  					basicPic.push(imgZip(src[i]));
  				}
      		}
      		
      	}
      	//声明一个方法，用于压缩图片
      	var imgZip=function(mysrc){
      		
      		var myImage=new Image();
      		myImage.src=mysrc;
      		var canvas=document.createElement("canvas");
      		var width=myImage.width;
      		var height=myImage.height;
			
      		 if (width > height) { 
                if (width > 100) { 
                    height = Math.round(height *= 100 / width); 
                    width = 100; 
                } 
            } else { 
                if (height > 100) { 
                    width = Math.round(width *= 100 / height); 
                    height = 100; 
                } 
            }
            
			canvas.width=width;
			canvas.height=height;
			var ctx=canvas.getContext("2d");
			
			ctx.drawImage(myImage,0,0,width,height);//进行绘图
			
			var dataUrl=canvas.toDataURL("image/png",0.8);
			
			return dataUrl.replace("data:image/png;base64,", "");
      		
      	}
      	
      	//声明一个函数用于通过dom和url生成对应的img
        var creatImg=function(url,dom){
        	if(url==""){
        		return false;
        	}
        	
        	var imgDom,fatherDom;
        	for(var i=0;i<url.length;i++){
        		
        		imgDom=document.createElement("img");
        		imgDom.src=url[i];
        		imgDom.className='confirmImg';
        		imgDom.setAttribute("data-preview-group","1");
        		imgDom.setAttribute("data-preview-src","");
        		fatherDom=document.getElementById(dom);
				fatherDom.style.width=75*url.length+"px";
				fatherDom.appendChild(imgDom);
        	}
        	
			
        }
      	
      	
      	var flatImg=function(url){
        	if(url==""){
        		return "";
        	}
        	var urlstr = "";
        	for(var i=0;i<url.length;i++){
        		urlstr += url[i];
        		urlstr += ";";
        	}
        	return urlstr;
        }
      	
      	
      	
      	
      	
      	//在此获取上一个页面传输过来的值
  		mui.plusReady(function() {  
  			//在此获取上一个页面传输的值
            self = plus.webview.currentWebview();
            document.getElementById("hospital").innerText=self.Hospital;
            document.getElementById("dep").innerText=self.Dep;
            document.getElementById("people").innerText=self.People;
            
            //给界面上的各个项目赋值
            document.getElementById("DeviceType").innerText=self.DeviceType;
            document.getElementById("DeviceTypeTwo").innerText=self.deviceTypeTwo;
            var DeviceTypeThree = document.getElementById("DeviceTypeThree");
            if(self.deviceTypeThree){
                DeviceTypeThree.innerText=self.deviceTypeThree;
            }else{
            	var parent = DeviceTypeThree.parentNode.parentNode;
            	parent.style.display = "none";
            }
            document.getElementById("DeviceModel").innerText=self.DeviceModel;
            document.getElementById("DeviceName").innerText=self.DeviceName;
            document.getElementById("DeviceFactory").innerText=self.deviceFactoryInfo;
            document.getElementById("DeviceArea").innerText=self.DeviceArea;
            document.getElementById("AssetNumberDom").innerText=self.AssetNumber;
            document.getElementById("baseDeviceDescription").innerText=self.DeviceInf;
            document.getElementById("ProductionDate").innerText=self.productionDate.substring(0,10);
            //document.getElementById("DeviceState").innerText=self.equipmentState;
           
            document.getElementById("DeviceDescription").innerText=self.DeviceDescription;
            //在这里生成基础信息图片
            creatImg(self.basicImgURL,"BasicImg");
            //在这里生成个性化信息图片
            creatImg(self.customImg,"CustomImg");
        }); 
    
        
        
    </script>
</body>

</html>